<template>
	<view class="bg-fff p20 radius20 flex">
		<image :src="data.image" class="w150 h150 radius10" mode="aspectFill"></image>
		<view class="flex1 ml20 als-s ov-h pt10 pb10 flex-col row-around">
			<view class="flex">
				<view class="fw-700 flex1 u-line-1">{{data.name}}</view>
				<view class="color-red fs30 fw-700">
					<text>{{data.suggested_price}}</text>
					<text class="fs24 fw-500">元/{{data.unit||'次'}}</text>
				</view>
			</view>
			<scroll-view scroll-x class="nowrap">
				<view class="flex">
					<view class="flex" v-for="(item,index) in data.tags" :key="index">
						<text class="bg-zs w8 h8 radius"></text>
						<text class="color-666 fs26 pl16 pr30">{{item}}</text>
					</view>
				</view>
			</scroll-view>
			<!-- <view class="flex flex-wrap" style="margin-right: -30rpx;">
				<view class="flex" v-for="(item,index) in data.tags" :key="index">
					<text class="bg-zs w8 h8 radius"></text>
					<text class="color-666 fs26 pl16 pr30">{{item}}</text>
				</view>
			</view> -->
		</view>
	</view>
</template>

<script>
	export default {
		name: "itemInfo",
		props: {
			data: {
				default: ''
			}
		},
		data() {
			return {

			};
		}
	}
</script>

<style lang="scss">

</style>
